<!DOCTYPE html>
<html lang="en-us">

<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1">
<title> Posts</title>


<link rel="stylesheet" href="https://www.nodebeginner.org/web-development-beginner-tutorial/css/slim.css">
<link rel="stylesheet" href="https://www.nodebeginner.org/web-development-beginner-tutorial/css/highlight.min.css">

<link rel="apple-touch-icon-precomposed" sizes="144x144" href="/apple-touch-icon-144-precomposed.png">
<link rel="shortcut icon" href="/favicon.ico">


<link href="https://www.nodebeginner.org/web-development-beginner-tutorial/post/index.xml" rel="alternate" type="application/rss+xml" title="The Web Development Beginner Tutorial" />

</head>

<body>
  <div class="container">
    <div class="header">
  <h1 class="site-title"><a href="https://www.nodebeginner.org/web-development-beginner-tutorial/">The Web Development Beginner Tutorial</a></h1>
  <p class="site-tagline">Learn software development for the web - from the ground up.</p>

  
</div>
    <div class="content">
      <div class="posts">
         
        <div class="post">
          <h2 class="post-title"><a href="https://www.nodebeginner.org/web-development-beginner-tutorial/post/preparations/">1 ◌ Preparations</a></h2>
          
		  
		  
		  	<div class="summary">
				<p>Before we can start with anything, we need to prepare an environment to work in over the course of this book. In order to give you correct advice and useful instructions at all times, I need to know your work environment as
precisely as possible. But because I&rsquo;m not exactly sitting next to you, this is a challenge. Fortunately, there is a very simple solution for this.</p>
				<a class="read-more" href="/web-development-beginner-tutorial/post/preparations/">Read more</a>
			</div>
		  
        </div>
        
        <div class="post">
          <h2 class="post-title"><a href="https://www.nodebeginner.org/web-development-beginner-tutorial/post/a-close-look-at-the-www/introduction/">2. a ◌ A close look at the WWW</a></h2>
          
		  
		  
		  	<div class="summary">
				<p>What happens when you open a web page in your browser? On the surface, your browser (the <em>client</em>) loads a page from a
remote system (the <em>server</em>) and displays its content. What exactly is displayed, and how it is presented to us, is
defined by the HTML, CSS and JavaScript code which the server sends back to our client.</p>
				<a class="read-more" href="/web-development-beginner-tutorial/post/a-close-look-at-the-www/introduction/">Read more</a>
			</div>
		  
        </div>
        
        <div class="post">
          <h2 class="post-title"><a href="https://www.nodebeginner.org/web-development-beginner-tutorial/post/a-close-look-at-the-www/the-building-blocks-of-the-world-wide-web/">2. b ◌ The building blocks of the World Wide Web</a></h2>
          
		  
		  
		  	<div class="summary">
				<p>The bad news is that even for a seemingly simple and innocent operation - like a browser requesting a single web page
from a server - there are so many moving parts involved that you could fill multiple books explaining them all. The good news, however, is that in order to become a productive web developer, we do not need to know all the atomic details.</p>
				<a class="read-more" href="/web-development-beginner-tutorial/post/a-close-look-at-the-www/the-building-blocks-of-the-world-wide-web/">Read more</a>
			</div>
		  
        </div>
        
        <div class="post">
          <h2 class="post-title"><a href="https://www.nodebeginner.org/web-development-beginner-tutorial/post/a-close-look-at-the-www/how-web-browsers-find-web-servers/">2. c ◌ How web browsers find web servers</a></h2>
          
		  
		  
		  	<div class="summary">
				<p>Web browsers and web servers talk to each other over the Internet. It is the client - the browser - which initiates the
exchange. What triggers a browser to do so is the user who enters a URL into the address bar, for example:
<code>http://www.example.com</code>.</p>
				<a class="read-more" href="/web-development-beginner-tutorial/post/a-close-look-at-the-www/how-web-browsers-find-web-servers/">Read more</a>
			</div>
		  
        </div>
        
        <div class="post">
          <h2 class="post-title"><a href="https://www.nodebeginner.org/web-development-beginner-tutorial/post/a-close-look-at-the-www/how-computers-on-the-internet-establish-a-network-connection/">2. d ◌ How computers on the Internet establish a network connection</a></h2>
          
		  
		  
		  	<div class="summary">
				<p>What happens next? Using the IP address it looked up, the browser can now attempt to establish a network connection to the target server.</p>
				<a class="read-more" href="/web-development-beginner-tutorial/post/a-close-look-at-the-www/how-computers-on-the-internet-establish-a-network-connection/">Read more</a>
			</div>
		  
        </div>
        
        <div class="post">
          <h2 class="post-title"><a href="https://www.nodebeginner.org/web-development-beginner-tutorial/post/a-close-look-at-the-www/how-computer-programs-talk-to-each-other-over-the-internet/">2. e ◌ How computer programs talk to each other over the Internet</a></h2>
          
		  
		  
		  	<div class="summary">
				<p>By now, we have established a general understanding of how computers find other computers on the Internet, and how they
can establish a network connection via IP addresses and data packet routing using these addresses.</p>
				<a class="read-more" href="/web-development-beginner-tutorial/post/a-close-look-at-the-www/how-computer-programs-talk-to-each-other-over-the-internet/">Read more</a>
			</div>
		  
        </div>
        
      </div>
      <div class="pagination">
   
</div>
    </div>
    <div class="footer">
  
  <p>Copyright (c) 2017 Manuel Kiessling</p>
  
</div>

  </div>
  <script src="https://www.nodebeginner.org/web-development-beginner-tutorial/js/slim.js"></script>

</body>

</html>
